/* 
  该文件就是写路由配置的地方  以后的配置都写在这里
*/

import Vue from 'vue'
import VueRouter from 'vue-router'
Vue.use(VueRouter)


// 导入页面   @代表src
import Login from '@/views/Login/Login.vue'
import Layout from '@/views/Layout/Layout.vue'
// 按需导入token方法
import {getToken} from '@/utils/token'

// 导入嵌套路由相关的页面
import Chart from '@/views/Layout/chart/index.vue'
import User from '@/views/Layout/user/index.vue'
import Enterprise from '@/views/Layout/enterprise/index.vue'
import Question from '@/views/Layout/question/index.vue'
import Subject from '@/views/Layout/subject/index.vue'

// 路由配置
const routes=
  [
    // 一级路由
    {path:'/Login',component:Login},
    {path:'/Layout',component:Layout,

    // 这行代码可以直接设置用户进入Layout页面后要显示那个页面
    redirect:'/Layout/user',
    // 嵌套路由 二级路由  
    // 注意点   以 / 开头的嵌套路径会被当做根路径 
    children:[
     { path:'chart',component:Chart},
     { path:'user',component:User},
     { path:'enterprise',component:Enterprise},
     { path:'question',component:Question},
     { path:'subject',component:Subject},
    //  使用重定向技术 让用户一进入Layout页面就显示用户列表
   // {path:'',redirect:'user'}
    ]
  },
    // 路由重定向
    {path:'/',redirect:'/Login'},
  ]

// 创建路由
const router = new VueRouter({
  routes
})
// beforeEach 导航守卫  其实是个回调函数 参数有三个 to（跳转到那个路径） from（跳转之前的路径） next（能不能跳转以及跳转到哪里）
// 如果不调用next 页面会一直进入循环  调用了才会放行进入下一个页面
// 导航守卫的触发时机  只要路由进行跳转 不管是点击还是手动输入 都会进入这个回调函数
router.beforeEach((to,form,next) =>{
  // console.log(to);
  // console.log(form);
      /*
      如果要跳转到登录页面 直接放行
      如果不是登录页面 需要先进行判断 如果有权限就放行 如果没有权限就跳回到login页面 
     */
    //console.log(getToken());
    if(to.path === '/login') {//如果要跳转到login页面
      next()//直接放行
    }else {//如果不是登录页面 就要再次进行判断 判断的依据是有没有token
      const token = getToken() //获取token
      if(token) {//如果为true 说明有token 是正常点击跳转
        next()//就同意
      }else {//如果进入这里就是false没有token
        next('/login')//就打回到登录页
      }
    }
})


// ES6中的默认导出
export default router
